<template>
  <PageBox :data="dataInfo" @searchBtn="getTbody" @resetForm="resetForm">
    <template #search="{ search }">
      <ElFormItemBox label="开单日期">
        <ElDaysBox :data="search" :dataName="['beginTime', 'endTime']" />
      </ElFormItemBox>
      <ElFormItemBox label="生产状态" prop="taskProduceState">
        <ElSelectBox :data="search" dataName="taskProduceState" :options="options.taskProduceState" />
      </ElFormItemBox>
    </template>
    <template #headL="{ search }">
      <div class="list-r-12 m-l-8">
        <el-divider direction="vertical" />
        <OrderBy title="一级排序" :data="search" dataName="orderBy" :options="options.orderBy" @searchBtn="getTbody" />
        <el-divider direction="vertical" />
        <OrderBy title="二级排序" :data="search" dataName="orderBy2" :options="options.orderBy2" @searchBtn="getTbody" />
      </div>
    </template>
    <template #taskProduceStateName="{ row }">
      <ElTagBox :data="row.taskProduceState" :options="options.taskProduceState" />
    </template>
  </PageBox>
</template>

<script setup lang="ts">
const { proxy } = getCurrentInstance() as any;
import './pageCss.scss'; // 引入样式
import { useListComponent } from './pageTs'; // 引入逻辑
const { dataInfo, getTbody } = useListComponent();
const options = reactive({
  taskProduceState: [
    {
      label: '全部',
      value: -1,
    },
    {
      label: '待生产',
      value: 0,
      type: 'info',
    },
    {
      label: '生产中',
      value: 1,
    },
    {
      label: '待停工',
      value: 2,
      type: 'warning',
    },
    {
      label: '已停工',
      value: 3,
      type: 'danger',
    },
    {
      label: '已完成',
      value: 4,
      type: 'success',
    },
  ],
  orderBy: [
    {
      label: '协议书号',
      value: 0,
    },
    {
      label: '机台名称',
      value: 1,
    },
    {
      label: '工艺名称',
      value: 2,
    },
    {
      label: '生产单号',
      value: 3,
    },
  ],
  orderBy2: [
    {
      label: '工序',
      value: 0,
    },
    {
      label: '打印长度',
      value: 1,
    },
    {
      label: '色数',
      value: 2,
    },
  ],
})
const resetForm = () => {
  // dataInfo.table.search.orderBy = 0
  // dataInfo.table.search.orderBy2 = 0
}
onMounted(() => {

});
</script>
